<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>科级管理人员个人有关事项报告管理系统</title>
    <link rel="icon" href="/cargocn-cloud-server/static/images/favicon.png" type="image/x-icon">
    <!-- Bootstrap Core CSS -->
    <link type="text/css" href="media/css/bootstrap.css" rel="stylesheet">
    <link type="text/css" href="media/css/bootstrap-btn.css" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link type="text/css" href="media/css/metisMenu.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link type="text/css" href="media/css/sb-admin-2.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link type="text/css" href="media/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="media/js/html5shiv.js"></script>
    <script src="media/js/respond.min.js"></script>
    <![endif]-->
    <style type="text/css">
        .login-bg{
            position: relative;
            z-index: 9;
            top: 0px;
            bottom: 90px;
            left: 0;
            background-image: url("/media/image/content.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center center;
            width: 100%;
            height: 600px;
        }
        @media(min-width: 1366px) {
            .login-bg{
                height: 466px;
            }
            .row-top{
                padding-top: 10px;
            }
        }
        @media(min-width: 1920px) {
            .login-bg{
                height: 910px;
            }
            .row-top{
                padding-top: 122px;
            }
        }
        .login-btn{
            margin-top: 10px;
        }
        .login-btn a{
            text-decoration: none;
            color: #54A9FE;
        }
        .login-btn a:hover {
            text-decoration: underline;
        }
        .login-panel{
            padding : 0 10px;
        }
        @media(min-width: 425px) {
            .login-panel{
                height: 320px;
                width: 356px;
                padding : 20px 30px 50px;
            }
        }
        .login-panel .panel-heading{
            background: #ffffff;
            border-color: #ffffff;
        }
        .login-panel .panel-heading .panel-title{
            font-weight: normal;
            min-height: 22px;
            color: #595959;
        }

        .login-panel .btn{
            background: #54A9FE;
            border-color: #54A9FE;
        }
        .banner-left img{
            position: relative;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center center;
        }
        .uberror{
            height:20px;
            overflow: hidden;
            color: red;
        }
        #login-row{
            margin-top: 60px;
            margin-bottom: 60px;
        }
    </style>
</head>
<body>
<div class="page text-center">
    <!-- SVG Sprite -->
    <div style="height: 0; width: 0; position: absolute; visibility: hidden;" aria-hidden="true">
        <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
            <symbol id="ripply-scott" viewBox="0 0 100 100">
                <circle id="ripple-shape" cx="1" cy="1" r="1"/>
            </symbol>
        </svg>
    </div>
    <!-- /end sprite -->
    <!--========================================================
                              HEADER
    =========================================================-->
    <header class="mod-1x">
        <section class="well-smx">
            <div id="stuck_container" class="stuck_container isStuck">
                <div class="container">
                    <nav class="navbar navbar-default navbar-static-top ">
                        <div class="navbar-header">
                            <h1 class="navbar-brand">
                                <a href="/">
                                    <img class="cargocn_logo" src="media/image/logo-geren.png" alt=""/>
                                </a>
                            </h1>
                        </div>
                        <ul class="navbar-nav sf-menu navbar-right" data-type="navbar">
                            <li>
                                <a href="http://10.0.5.24:8081/geren_web_doc.zip" target="_blank">说明文档</a>
                            </li>
                            <%--<li class="dropdown">--%>
                            <%--<a href="/about.html">推荐浏览器</a>--%>
                            <%--<ul class="dropdown-menu">--%>
                            <%--<li>--%>
                            <%--<a href="/about.html#introduction">公司简介</a>--%>
                            <%--</li>--%>
                            <%--<li>--%>
                            <%--<a href="/about.html#growth">发展历程</a>--%>
                            <%--</li>--%>
                            <%--<li>--%>
                            <%--<a href="/about.html#team">管理团队</a>--%>
                            <%--</li>--%>
                            <%--<li>--%>
                            <%--<a href="/about.html#contact">联系我们</a>--%>
                            <%--</li>--%>
                            <%--</ul>--%>
                            <%--</li>--%>
                            <%--<li>--%>
                            <%--<a href="/product.html">产品</a>--%>
                            <%--</li>--%>
                            <%--<li>--%>
                            <%--<a href="/service.html">服务</a>--%>
                            <%--</li>--%>
                            <li>
                                <a href="http://10.0.5.24:8081/360cse_8.7.0.300.exe" target="_blank">推荐浏览器</a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </section>
    </header>
    <!--========================================================
                              CONTENT
    =========================================================-->

    <div class="container login-bg clearfix">
        <div class="row row-top row-center">
            <div class="visible-lg col-lg-4 col-md-4 col-md-offset-2">
            </div>
            <div class="col-lg-3 col-lg-offset-2 col-md-4 col-sm-4 col-sm-offset-4 col-xs-12">
                <div class="login-panel panel panel-default">
                    <div class="panel-heading text-center">
                        <h2 class="panel-title">欢迎登录科级管理人员个人有关事项报告管理系统</h2>
                        <div class="uberror"></div>
                    </div>
                    <div class="panel-body text-left">
                        <form id="form" method="post">
                            <fieldset>
                                <div class="form-group">
                                    <input class="form-control noErrorMessage" placeholder="用户名" name="username" type="text" value="" autofocus>
                                </div>
                                <div class="form-group">
                                    <input class="form-control noErrorMessage" placeholder="密码" name="password" type="password" value="">
                                </div>
                                <!-- Change this to a button or input when using this as a form -->
                                <button class="btn btn-lg btn-primary btn-block" id="login-btn">登录</button>
                            </fieldset>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--========================================================
                            FOOTER
    =========================================================-->
    <footer>
        <section class="well">
            <div class="container">
                <p class="rights">
                    Copyright &#169; <span id="copyright-year">2016</span>
                    TISCO
                    版权所有
                </p>
            </div>
        </section>
    </footer>
</div>
<script src="media/js/jquery.js"></script>
<script src="media/js/jquery-migrate-1.2.1.min.js"></script>
<script src="media/js/jquery.validate.js"></script>
<!-- Metis Menu Plugin JavaScript -->
<script src="media/js/metisMenu.min.js"></script>

<script src="media/js/bootstrap.min.js"></script>
<!-- Custom Theme JavaScript
<script src="http://static.cargocn.com/libs/startbootstrap-sb-admin-2/1.0.8/dist/js/sb-admin-2.js"></script>-->
<script src="media/js/sb-admin.js"></script>
<script src="media/js/device.min.js"></script>
<script src="media/js/tm-scripts.js"></script>\

<script type="text/javascript">
    $(document).ready(function() {
        $("#form").validate({
            errorElement : 'span',
            errorClass : 'help-block',
            rules : {
                username : {
                    required : true
                },
                password : {
                    required : true
                }
            },
            messages : {
                username : {
                    required : "请输入用户名！"
                },
                password : {
                    required : "请输入密码！"
                }
            },
            errorPlacement : function(error, element) {
                if(!$(element).hasClass("noErrorMessage"))
                    $(element).closest('.form-group').append(error);
            },
            highlight : function(element) {
                $(element).closest('.form-group').addClass('has-error has-feedback');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).closest('.form-group').removeClass('has-error');
            },
            success : function(label,element) {
                if($(label)) $(label).remove();
            },
            submitHandler: function(form) {
                var $form = $(form);
                $.ajax({
                    type : 'post',
                    url : 'sign_up_commit',
                    async : false,
                    data : $form.serialize(),
                    success :function (result) {
                        if(result.result == "success"){
                            window.location.href = "login_index";
                        }else{
                            $(".uberror").html("登录失败，请确认用户名或是密码");
//                            $('.alert-error', $('.login-form')).show();
                        }
                    }
                });
            }
        });
    })

</script>



</body>
</html>